<template>
  <div class="app-container order-list-index">
    <TableComponents
      ref="tableRef"
      :url="'/wms/bmsBill/bmsBillDetailList'"
      :params="params"
      :columns="columnsAry"
      :methodType="'post'"
      :return-data="returnData"
    ></TableComponents>
  </div>
</template>

<script>
import dayjs from 'dayjs'
import { PayType, CustomerAccountsReceivable } from '@/views/financial/const/index.js'
import FormComponents from '@/components/FormComponents/index.vue'
import TableComponents from '@/components/Table/list.vue'
import TabFilter from '@/components/Tab/tabFilter.vue'

export default {
  components: {
    FormComponents,
    TableComponents,
    TabFilter
  },

  data() {
    return {
      activeName: 1,
      columnsAry: [
        { prop: 'financeNo', label: this.$t('fiance.No'), width: '100px' },
        { prop: 'amount', label: this.$t('fiance.amount'), width: '100px' },
        { prop: 'payeeName', label: this.$t('fiance.payeeName'), width: '100px' },
        { prop: 'payerName', label: this.$t('fiance.payerName'), width: '100px' },
        { prop: 'createTime', label: this.$t('common.createTime'), width: '100px' },
      ],
      params: {}
    }
  },
  methods: {
    handleClick(v) {
      this.activeName = v
      this.getList()
    },
    handleSeacrh(v) {
      this.filterParams = {
        ...v.filterForm,
        ...v.filterParam
      }
      this.$refs.tableRef.handleSearchParams(this.filterParams)
    },
    getList() {
      this.$refs.tableRef.getList()
    },
    returnData(data) {
      return data.content.map(r => {
        r.createTime = dayjs(r.createTime).format('YYYY-MM-DD HH:mm:ss')
        r.typeName = (PayType.find(c => c.value === r.type) || {}).label
        r.feeCodeName = (CustomerAccountsReceivable.find(t => t.value === r.feeCode) || {}).label
        return r
      })
    },
    open(obj) {
      this.$refs.tableRef.handleSearchParams({billId: obj.id })
    }
  },
}
</script>
<style lang="scss">
.tableTooltip {
  border-top: 1px solid #ebeef5;
  border-left: 1px solid #ebeef5;
  border-right: 1px solid #ebeef5;
  background: #f5f7fa;
  padding: 12px;
  color: #606266;
}
</style>
